<template>
  <div>
    HOME
    <router-link to="/home/A?qq=123">A</router-link>
    <router-link to="/home/B">B</router-link>
    <button @click='goA'>A</button>
    <button @click='goB'>B</button>
    <router-view></router-view>
  </div>
</template>
<script>
// @ is an alias to /src
export default {
  name: "XXX",
  data() {
    return {};
  },
  methods: {
    goA() {
      // push 会新增一条历史记录 ；  replace不会 只是把当前的这条历史替换了
      // $router  $route
      // this.$router.replace("/A");
      // this.$router.push({ path: "/A", query: { q: 123, e: 345 } });
      this.$router.push({ path: "/home/A?ww=234&rr=456" });
      this.$route;
    },
    goB() {
      this.$router.push({ name: "BBB", params: { qqq: 666 } });
    },
  },
  watch: {
    $route(val) {
      //只要路由发生改变就会触发这个回调
      console.log("watch", val);
    },
  },
};
</script>
<style lang="less">
</style>